<?
/**
 * Copyright 2007 Melange.
 *
 * This file is part of PHP-MELANGE.
 *
 * PHP-MELANGE is free software; you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation; either version 2 of the License, or
 * (at your option) any later version.
 *
 * PHP-MELANGE is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with PHP-MELANGE; if not, write to the Free Software
 * Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA  02110-1301  USA
 *
 * @category    Melange
 * @package     php-melange
 * @subpackage  cms
 * @copyright   Copyright (c) 2007 Jeroen Simons. All rights reserved
 * @author      Jeroen Simons <jeroen@melange.nl>
 * @link        http://www.melange.nl/
 *
 */
?>
<?=$this->header(true)?>

    <?=$this->menu($this->parameter("help"))?>

    <h1>Help</h1>

    <? /* Breadcrums route & page info display */ ?>
    <?=$this->route("Help")?>

    <div id="help">

        <hr />
        <br />

        <h2>Help Index</h2>

        <ol>
            <li>
                <a href="help#lists">Lists</a>
                <ol>
                    <li><a href="help#activate">Activate/Deactivate items.</a></li>
                    <li><a href="help#add">Add items.</a></li>
                    <li><a href="help#deleting">Delete items.</a></li>
                    <li><a href="help#edit">Edit items.</a></li>
                    <li><a href="help#search">Find items.</a></li>
                    <li><a href="help#move">Move items.</a></li>
                    <li><a href="help#sort">Sort items.</a></li>
                    <li><a href="help#translate">Translate items.</a></li>
                </ol>
            </li>
            <li>
                <a href="help#forms">Forms</a>
                <ol>
                    <li><a href="help#errors">Errors</a></li>
                    <li><a href="help#image">Images</a></li>
                    <li><a href="help#richtext">Rich-text</a></li>
                </ol>
            </li>
        </ol>

        <br />
        <hr />
        <br />

        <a name="lists"></a>
        <h2>1. Lists</h2>
        <p>
            Lists are the index pages of each section in the CMS. Clicking any link on the top menu will take to a listing page.
            Listing pages sometimes have custom functionality but in general they all work the same.
        </p>

        <pre>
 ------------------------------------
| Menu                               |
 ------------------------------------
| Header                             |
 ------------------------------------
| Route                    Page Info |
 ------------------------------------
| Add New | Search & Filter          |
 ------------------------------------
|                                    |
|     column-name                    |
|  -              ------   --------  |
| |x| Result row | Edit | | Delete | |
|  -              ------   --------  |
|  -              ------   --------  |
| |x| Result row | Edit | | Delete | |
|  -              ------   --------  |
|  -              ------   --------  |
| |x| Result row | Edit | | Delete | |
|  -              ------   --------  |
|                                    |
 ------------------------------------
|  ^ Actions (activate, delete, etc) |
 ------------------------------------
|                   Logout  Settings |
 ------------------------------------
        </pre>

        <p>These are the most common listing functions:</p>

        <ol>
            <li><a href="help#activate">Activate/Deactivate items.</a></li>
            <li><a href="help#add">Add items.</a></li>
            <li><a href="help#deleting">Delete items.</a></li>
            <li><a href="help#edit">Edit items.</a></li>
            <li><a href="help#search">Find items.</a></li>
            <li><a href="help#move">Move items.</a></li>
            <li><a href="help#sort">Sort items.</a></li>
            <li><a href="help#translate">Translate items.</a></li>
        </ol>

        <a name="activate"></a>
        <h3>1.1 Activate &amp; Deactivate items</h3>
        <p>
            By default every new added item will show on the extranet immediately. If you want to hide an item for the public, you can simply deactivate it.
            Select the items you would like to deactivate by using the <input type="checkbox" checked=\"checked\" /> checkboxes.
            Then select "<b>Deactivate</b>" using the select-box <select><option>With Selected</option></select> at the bottom of the page.
        </p>

        <a name="add"></a>
        <h3>1.2 Add items</h3>
        <p>You can add a new item by clicking on the <input type="button" value="New" class="button" /> button.</p>

        <a name="delete"></a>
        <h3>1.3 Delete items</h3>
        <p>
            You can delete an existing item by clicking on the <input type="button" value="Delete" class="button" /> button.
            You will be prompted to confirm the deletion.
            It's also possible to delete more items at once.
            First select the rows you would like to delete by checking the <input type="checkbox" checked=\"checked\" /> checkboxes in the results.
            Then choose "<b>Delete</b>" using the select-box <select><option>With Selected</option></select> at the bottom of the page.
            <br /><br />
            <i>Note: Be careful if you delete an english item that has translations to other languages. These will also be deleted!</i>
        </p>

        <a name="edit"></a>
        <h3>1.4 Edit items</h3>
        <p>
            You can edit an existing item by clicking on the <input type="button" value="Edit" class="button" /> button.
            <br /><br />
            <i>Note: It's not possible to edit more than 1 item at a time.</i>
        </p>

        <a name="search"></a>
        <h3>1.5 Find items</h3>

        <p>
            Every listing page in the CMS has extensive search &amp; filter capabilities. There are 4 inputs that can help you find a specific item.

            <?=$this->panel("#", $this->listForm)?>

            <ol>
                <li>
                    <h4>Search (Keywords)</h4>
                    This is a text input field where you can enter 1 or more keywords.
                    If you enter 2 keywords, i.e. "<b>Amsco Project</b>", the system will search for records containing the word "<b>Amsco</b>" or "<b>Project</b>".
                    It is also possible to enter dates using the "<b>yyyy-mm-dd</b>" (year-month-day) format.
                </li>
                <li>
                    <h4>Fields</h4>
                    This select-box allows you search within a specific field like "<b>Title</b>" or "<b>Body</b>".
                    This is especially handy if your "Keyword Search" returns too many records and you want to narrow down the results.
                    <br />
                    It is also possible to filter on fields like "<b>Active</b>".
                    Simply use keyword "<b>Yes</b>" or "<b>No</b>" in "<b>Search</b>".
                </li>
                <li>
                    <h4>Languages</h4>
                    This select-box allowes you to filter your query on a specific language.
                    Selecting "<b>French</b>" will only return items that are translated to french.
                    <br /><br />
                    <i>This select-box will also work without entering a "<b>Search Keyword</b>".</i>
                </li>
                <li>
                    <h4>Results</h4>
                    This select-box sets the amount of results shown for every page.
                    <br />
                    If there are more results than this value, you can navigate through the pages using the "Page: <a href="#">1</a> | <b>2</b> | <a href="#">3</a>" navigator at the top right corner of the page.
                    <br />
                    It is also possible to set this select-box on "<b>All</b>". This will show all records available (it might take a while to load all results).
                    <br /><br />
                    <i>This select-box will also work without entering a "<b>Search Keyword</b>".</i>
                </li>
                <li>
                    <h4>Clear</h4>
                    To reset your query simple click the <input type="button" class="button" value="Clear" /> button. This will reset "<b>Search & Filter</b>" to default settings.
                </li>
            </ol>
        </p>

        <a name="sort"></a>
        <h3>1.6 Move items</h3>
        <p>
            Some listing pages allow you to move items to a specific order. The same order will be used on the live site.
            Use the <input type="image" onclick=""
                           src="static.php?file=/Users/jeroen/EclipseProjects/extranet.amsco.org/document_root/_library/melange/cms/core/view/gfx/arrow_up.png" alt=""
                           alt="Move up"
                           title="Move up. Before moving make sure to sort the rows using the 'Order' link above!" /> and
                    <input type="image" onclick=""
                           src="static.php?file=/Users/jeroen/EclipseProjects/extranet.amsco.org/document_root/_library/melange/cms/core/view/gfx/arrow_down.png"
                           alt="Move down"
                           title="Move down. Before moving make sure to sort the rows using the 'Order' link above!" /> buttons to move items around.
            <br /><br />
            <i>Note: Before moving items make sure to sort the rows first using the "<b>Order</b>" table header.</i>
        </p>

        <a name="sort"></a>
        <h3>1.7 Sort items</h3>
        <p>
            Every listing page features clickable table-headers.
            You can list the results in ascending or descending order by clicking once or twice on the same table-header.
            The active table-header will show a <img src="static.php?file=/Users/jeroen/EclipseProjects/extranet.amsco.org/document_root/_library/melange/cms/core/view/gfx/bullet_arrow_down.png" width="16" height="5" alt="" class="sort" /> or <img src="static.php?file=/Users/jeroen/EclipseProjects/extranet.amsco.org/document_root/_library/melange/cms/core/view/gfx/bullet_arrow_up.png" width="16" height="5" alt="" class="sort" /> arrow on the right-hand side.
        </p>

        <a name="translate"></a>
        <h3>1.8 Translate items</h3>
        <p>
            Most of the times it is possible to translate items to a language other than english.
            If an item allowes translation it will show a flag <img src="static.php?file=<?=$this->image("cms/core/view/gfx/flag/gb.png")?>" width="16" height="11" alt="English" class="flag" /> in the "<b>L</b>" column, which stands for "<b>Language</b>"
            and 1 or more flags <img src="static.php?file=<?=$this->image("cms/core/view/gfx/flag/fr.png")?>" width="16" height="11" alt="French" title="<?=$this->message("title.translate.item", _Core::BUNDLE)?> (French)." class="flag" /> <img src="static.php?file=<?=$this->image("cms/core/view/gfx/flag/de.png")?>" width="16" height="11" alt="German" title="<?=$this->message("title.translate.item", _Core::BUNDLE)?> (German)." class="flag" /> in the "<b>A</b>" column.
            The "<b>A</b>" column stands for "<b>Available Languages</b>".
            To add a translation to french, click the french flag in the "<b>A</b>" column.
            Once added, the translated item will appear right under the english item using <img src="static.php?file=/Users/jeroen/EclipseProjects/extranet.amsco.org/document_root/_library/melange/cms/core/view/gfx/arrow_merge.png" title="Translation of item above. (Dutch)" width="16" height="16" alt="" /> image.
            <br /><br />
            <i>Note: Available languages can be set in the <a href="setting/index">CMS Settings</a> section.</i>
        </p>

        <br />
        <hr />
        <br />

        <a name="forms"></a>
        <h2>2 Forms</h2>
        <p>
            Forms are input-field pages for every section in the CMS.
            Forms will be shown when you click on a <input type="button" class="button" value="New" /> or <input type="button" class="button" value="Edit" /> button on the listing pages.
            The input-fields are always separated between "<b>required</b>" and "<b>optional</b>" fields.
        </p>

        <a name="errors"></a>
        <h3>2.1 Errors</h3>
        <p>
            Saving an item without providing input for all the required fields will not work.
            All the provided input is checked on the server whether its a required field or not.
            In case there is an error (i.e. invalid URL or E-mail address) this error box will display what the problem is.
            See below an example of an error box.
            Clicking one of these links will take you to invalid input-field.
            <div id="errorMsg"><h3>The form contains errors!</h3><ol><li><a href="#" title="Jump to error">Title is required.</a></li><li><a href="#" title="Jump to error">E-mail is not a valid e-mail address.</a></li></ol></div>
            <br />
        </p>

        <a name="image"></a>
        <h3>2.2 Images</h3>
        <p>
            Sometimes the CMS allows you to import more than 1 image at once.
            You will need to upload the images first using a FTP client. Remember the directory where you put the images in! I.e. <b>public_html/extranet/import/XMAS-2007</b>.
            Then using a FTP client make the directory "<b>World Writable</b>".
            Back at the CMS use the "<b>public_html/extranet/import/XMAS-2007</b>" directory for the "<b>Directory</b>" field and submit.
            After importing its safe to delete the <b>XMAS-2007</b> directory using a FTP client.
        </p>

        <a name="richtext"></a>
        <h3>2.3 Rich-text</h3>
        <p>
            Many times the "<b>Description</b>" or "<b>Body</b>" fields are so-called "<b>Rich-text Editors</b>".
            See below an example of a rich-text input-field.
            <br />
            This editor allows you to style your text with things like <b>B</b>old and <i>I</i>talic.
            Its also possible to add images, links and tables to your text.
            Simply select the text you want to style and click one of the buttons. Are you not sure what a button means, move the mouse over the button and an explanation balloon will appear.
            <br /><br />
            <textarea mce_editable="true" rows="12" cols="60">test</textarea>
            <br />
        </p>

    </div>

<?=$this->footer()?>